{# Template for home page for cat; it lists all the books/movies/music #}
{% extends "home_base.html" %}

{% spaceless %}

{% block entries%}
<h2 id="itemsHeading">Books in my Library</h2>
<style>

	.flexigrid div.fbutton .add
		{
			background: url(/media/css/images/add.png) no-repeat center left;
		}

	.flexigrid div.fbutton .delete
		{
			background: url(/media/css/images/close.png) no-repeat center left;
		}

</style>

<div class="bborderx">
<table id="flex1" style="display:none"></table>
</div>

<script type="text/javascript">
			$('.flexme1').flexigrid();                        
			$('.flexme2').flexigrid({height:'auto',striped:false});

			$("#flex1").flexigrid
			(
			{
			url: '/populategrid/', //Django view
                        dataType: 'json',
			colModel : [
				//{display: 'ID', name : 'ID', width : 40, sortable : true, align: 'center'},
				{display: 'Title', name : 'title', width : 180, sortable : true, align: 'left'},
				{display: 'Authors', name : 'authors', width : 180, sortable : true, align: 'left'},
				{display: 'Publisher', name : 'publisher', width : 100, sortable : true, align: 'left'},
                                {display: 'ISBN', name : 'isbn', width : 80, sortable : true, align: 'left'}

				],
			buttons : [
				{name: 'Add', bclass: 'add', onpress : test},
				{name: 'Delete', bclass: 'delete', onpress : test},
				{separator: true}
				],
                        searchitems : [
				{display: 'Title', name : 'title'},
                                {display: 'Author(s)', name : 'authors', isdefault: true},
				{display: 'Publisher', name : 'publisher'},
                                {display: 'ISBN', name : 'isbn'}
				],
			sortname: "title",
			sortorder: "asc",
			usepager: true,
			title: 'Books',
			useRp: true,
			rp: 10,
			showTableToggleBtn: true,
			width: 620,
			height: 300,
                        resizable: false
			}
			);

			function test(com,grid)
			{
				if (com=='Delete')
					{
						confirm('Delete ' + $('.trSelected',grid).length + ' items?')
					}
				else if (com=='Add')
					{
						alert('Add New Item');
					}
			}

		$('b.top').click
		(
			function ()
				{
					$(this).parent().toggleClass('fh');
				}
		);

</script>

{% endblock entries%}

{% endspaceless %}